<template>
  <!-- 提现管理 -->
  <view class="content" v-if="!state.loading">
    <view class="box bg-white fz26">
      <view class="tit flex flex-y-center">回复内容：</view>
      <view class="textarea mt30 bg-gray">{{ state.dataSource.remark || '无' }}</view>
      <!-- <view class="mt30" v-else>无</view> -->
      <view class="mt30 t-r gray6">审批人：{{ state.dataSource.approver }}</view>
      <view class="mt30 t-r gray6">审批时间：{{ state.dataSource.approveTime }}</view>
    </view>
  </view>
</template>

<script setup>
import { reactive, getCurrentInstance } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { withdrawalDetails } from '@/common/js/getData.js';

const { proxy } = getCurrentInstance();
const state = reactive({
  loading: true,
  id: '',
  dataSource: {}
});

// 提现详情
const loadData = () => {
  const data = {
    id: state.id
  };
  withdrawalDetails(data)
    .then(res => {
      if (res.success) {
        state.dataSource = res.result;
      }
    })
    .finally(() => {
      state.loading = false;
    });
};

// 页面加载完成
onLoad(async option => {
  await proxy.$onLaunched;
  state.id = option.id;
  loadData();
});
</script>

<style lang="less" scoped>
@import url('@/common/less/common.less');

.box {
  padding: 60rpx 30rpx;
  .tit {
    line-height: 1;
    &:before {
      content: '';
      display: block;
      width: 8rpx;
      height: 30rpx;
      margin-right: 20rpx;
      background: @yellow;
    }
  }
  .textarea {
    padding: 30rpx;
    line-height: 1.5;
    text-align: justify;
  }
}
</style>
